<%@page import="java.util.Date"%>
<%@page import="com.mongodb.DBObject"%>
<%@page import="com.mongodb.DBCursor"%>
<%

%>

<jsp:include page="layout/header.jsp">
	<jsp:param name="title" value="Payment" />
	<jsp:param name="description" value="" />
	<jsp:param name="keywords" value="" />
	<jsp:param name="page" value="home" />
</jsp:include>		
		
		<div id="content">
        	<div id="content_inner">
            	<div id="maincontent">
                    <div id="payment" class="clearafter">
                        <h2 class="title">Payment</h2>
                        <div class="clearafter">
                        	<div class="left">
                        		<form action="/payment" method="post" style="width: 450px;">
		                            <ul>
		                            	<li class="clearafter first">
		                                    <span class="site-name fee">
		                                    	Buy Credit - min pay 5$
		                                    </span>
		                                </li>
		                                <li class="clearafter">
		                                    <span class="site-name fee">
		                                    	<input type="text" name="price" id='price'/> $
		                                    </span>
		                                    <span class="days-left" id='coin'>2500 Credit</span>
		                                </li>
		                                <li class="clearafter last">
		                                    <a href="/manager-blog" class="back">Back</a>
		                                    <button class="checkout" type="submit">Checkout</button>
		                                </li>
		                            </ul>
	                            </form>	                        	
                        	</div>
                        	<div class="right">
	                            <p>Enter the coupon code to have more credit.</p>	                        	
	                        	<form action="/coupon">                        		
	                        		<label for="coupon">Coupon code</label>	
	                                <input type="text" id="coupon" name="coupon"/>
	                                <input type="hidden" name="blog" id="hidden-coupon"/>	                                
	                                <button type="submit" class="recent" style="float: none;background: #CCC;margin-bottom:10px;" disabled="disabled">Use</button>
	                                <span class="icon-large-checkmark" style='display:none;'>You saved $2</span>
	                                <span class="icon-large-close" style='display:none;'>Coupon code is invalid</span>
	                        	</form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
<script type="text/javascript">
	$(document).ready(function(){
		$("#price").val(5);
		$("#price").keyup(function(){
			if($("#price").val()>=5)
			{
				$("#price").val($("#price").val().replace(/[^0-9]+/g,""));
				$("#coin").html(parseInt(parseFloat($('#price').val())/0.002)+" Credit");
			} else {
				$("#price").val($("#price").val().replace(/[^0-9]+/g,""));
				$("#coin").html("<span style='color:red;'>Min of payment is US $5</span>");
			}
		});
		$(".checkout").click(function(){
			if(parseInt($("#price").val())<5)
			{
				return false;
			}
		});
	});
	$("#coupon").keyup(function(){

		$("#hidden-coupon").val($(".hidden").eq(0).val());
		$.get(
				'/checkcoupon',
				{
					coupon:$("#coupon").val(),
				},
				function(data)
				{
					if(data!=2)
					{
						$(".icon-large-checkmark").text("Your get "+data+" credit");
						$(".icon-large-checkmark").css("display","inline-block");
						$(".icon-large-close").css("display","none");
						$(".recent").attr("disabled",false);
						$(".recent").css("background","#D54E21");
					} else {
						$(".icon-large-checkmark").css("display","none");
						$(".icon-large-close").css("display","inline-block");
					}
				}
		);
	});
</script>        
<%@ include file='/layout/footer.jsp'%>         